<!DOCTYPE html>
<html>
<head>
    <title>{{ the_title }}</title>

    <!-- Bootstrap core CSS -->
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="https://v3.bootcss.com/examples/signin/signin.css" rel="stylesheet">
    <style>
        body {
            background-image: linear-gradient(#FFEFD5, #FFB6C1,#7FFFAA);
            background-repeat: repeat;
            background-attachment: fixed;
            background-size: cover;
            margin-top:       10%;
            margin-bottom:    50%;
            margin-left:      8%;
            margin-right:     10%;
            padding: 0;
            
        }
        .container {
            width: 100%;
            background-color: 	#FFE4E1;
            border: 1px solid white;
            border-radius: 50px 50px 50px 50px;
            padding: 30px 20px 30px 20px;
            float: left;
        }
        h1 {
            display: block;
            margin-block-start: 0.5em;
            margin-inline-start: 0px;
            margin-inline-end: 0px;
            font-weight: bold;
            color: 	#F08080;
        }
        p {
            color: #8B4513;
            margin-block-end: 1em;
        }
        .btn-primary{
            background-color: #7FFFAA;
            border-color: #00FF7F;
        }
    </style>
</head>

  <body>
<h1>{{ the_title }}</h1>
<p>利用了高德地图API中的地理编码和步行路径规划的功能，在下方输入结构化地址即可获得步行路径规划的结果。</p>
    <div class="container">
      <form class="form-signin" method='POST' action='/search0'>


        <input name='start_address' type='text' id="inputEmail" class="form-control" placeholder="起点" required="" autofocus="" style="border-bottom-right-radius: 0;border-bottom-left-radius: 0;">
        <input name='end_address' type='text' id="inputEmail" class="form-control" placeholder="终点" required=""  style="border-radius: 0">
        <input name='key' type="password" id="inputPassword" class="form-control" placeholder="密钥" required="" style="border-top-right-radius: 0;border-top-left-radius: 0;">

        <button class="btn btn-lg btn-primary btn-block" type="submit">获取结果（日志系统）</button>
      </form>

    </div>

</body>
</html>

